html,
body {
  background: #fff;
  padding-top: 0;
  scroll-behavior: smooth !important;
}
a {
  transition: 0.2s;
}
a.btn,
button.btn {
  transition: 0.5s;
}
/* temporary ios scroll fix */
/* .ios div:not(.no-ios-scroll) {
  -webkit-overflow-scrolling: touch !important;
} */
/* temporary fix */
.h1-wrapper h1 {
  font-size: 2.2rem;
}

/* Common */
.space-content-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  margin-right: -15px;
  margin-left: -15px;
  column-gap: 10px;
  row-gap: 15px;
}

/* Album related */
.album-image-box img {
  width: 100%;
  object-fit: cover;
  background: rgba(255, 255, 255, 0.1);
}
.col-4 .album-image-box img {
  height: 30vw;
}
.col-6 .album-image-box img {
  height: 40vw;
}
@media (min-width: 768px) {
  .col-md-3 .album-image-box img {
    height: 22vw;
  }
  .col-4 .album-image-box img {
    height: 22vw;
  }
}
@media (min-width: 992px) {
  .col-lg-2 .album-image-box img {
    height: 12vw;
  }
}
.album-image-wrapper.selection {
  padding: 0.4rem;
  border-radius: 0.25rem;
  cursor: pointer;
  border: 2px solid transparent;
}
.album-image-wrapper.selection > * {
  pointer-events: none;
}
.album-image-wrapper.selection:hover {
  background-color: #ffbd7b;
  transition: background-color 0.25s;
  -webkit-transition: background-color 0.25s;
}
.album-image-wrapper.selection:after {
  content: "\f058";
  color: #ff8100;
  margin-left: 4px;
  font-family: "Font Awesome 5 Free";
}
.album-image-wrapper.checked {
  border: 2px solid #ff8100 !important;
}
.album-image-wrapper.checked:after {
  font-weight: 900;
}
h3 .group-header-check > i {
  font-size: 1.3rem;
}
/* Album related */
.space-cover-img {
  aspect-ratio: 4/1;
  object-fit: cover;
}
.list-grid .item {
  height: auto;
  /* max-height: 350px;*/
}
.item-scale-wrapper {
  height: 100px; /* 上書き */
}
.rally-image-wrapper,
.qms-image-wrapper {
  height: 140px;
}
.list-grid .item img,
img.item-scale {
  width: 100%;
  height: 100px;
  object-fit: cover;
}
.space-main-wrapper .list-grid .description {
  max-height: 9rem;
  line-height: 1.5;
  text-overflow: ellipsis;
  overflow: hidden;
  display: -webkit-box;
  -webkit-line-clamp: 3;
  -webkit-box-orient: vertical;
}
.p-wrapper .lead {
  font-size: 1rem !important;
  line-height: 1.8;
}
/* Space details Iframe */
.note-video-clip {
  width: 95% !important;
  margin: 0.5em 2.5% !important;
}
/*public space*/
.top-lead {
  border-bottom: 1px solid rgba(255, 255, 255, 0.4);
}
p.lead {
  font-size: 1rem;
  line-height: 1.5;
}
.more {
  margin: 0;
  padding: 0;
  font-size: 0.9rem;
}
.more a {
  display: block;
  text-align: center;
  padding: 3px;
  background: #eee;
  width: 100%;
  border-radius: 2px;
}
.more a:hover {
  background: #3a79aa;
  color: #fff !important;
}
.space-item-wrapper .space-item-title,
.space-user-content-wrapper .space-item-title {
  margin: 0 0 20px;
}
.iterate h4.list-card-title {
  margin: 0 0 2px;
  font-size: 1rem;
  font-weight: 500;
}
.space-user-content-wrapper h4 {
  margin: 0px;
  text-overflow: ellipsis;
  overflow: hidden;
  display: -webkit-box;
  -webkit-line-clamp: 1;
  -webkit-box-orient: vertical;
  width: 8.5rem;
}
.space-user-content-wrapper div.small {
  font-size: 11px;
}
.add-user-content-container {
  grid-row-start: 1;
  grid-row-end: 2;
  grid-column-start: 1;
  grid-column-end: 2;
}
#add-user-content-wrapper {
  border: dashed 3px #6c757d;
  border-radius: 8px;
}
#add-user-content-wrapper:hover #add-user-content {
  color: #ff8800;
}

.space-item-wrapper .item.shadow {
  box-shadow: 0 0.5rem 1rem rgba(0, 0, 0, 0.2) !important;
}
#geo_map {
  border: 1px solid rgba(0, 0, 0, 0.1);
}
#view-all-content {
  display: block;
  margin-left: auto;
  margin-right: auto;
  text-align: center;
}
#view-all-content:hover,
#view-all-content:active {
  background: #3a79aa;
  color: #fff !important;
}
/* user contents */
.user-content-grid {
  grid-template-columns: repeat(4, minmax(0, 1fr));
}
.space-item-wrapper .state_list.state_wrapper {
  min-height: inherit;
}

.state_list.state_wrapper {
  position: absolute;
  top: -1px;
  right: 0;
  width: 76px;
  height: 76px;
  overflow: hidden;
}
.state_list.state_wrapper .sc-new {
  display: inline-block;
  position: absolute;
  padding: 5px 0;
  left: -10px;
  top: 12px;
  width: 115px;
  text-align: center;
  font-size: 13px;
  line-height: 16px;
  background: #30b408;
  color: #fff;
  letter-spacing: 2px;
  -webkit-transform: rotate(42deg);
  transform: rotate(42deg);
  box-shadow: 0 2px 5px rgb(0 0 0 / 20%);
  border-radius: 0;
  z-index: 100;
}
.space-item-wrapper .state_list,
.user-content .state_list {
  line-height: 1;
  min-height: 1rem;
}
.state_list span {
  display: inline-block;
  border-radius: 50px;
  line-height: 1;
  font-size: 11px;
  color: #fff;
}
/*
span.sc-new {
  background: #0ad465;
}
*/
span.sc-prefer {
  background: #ff3a5c;
}
span.sc-trending {
  background: #ff8800;
}
.monetization-state {
  position: absolute;
  top: -1px;
  left: 0;
  width: 76px;
  height: 76px;
  overflow: hidden;
}
.monetization-state .sc-monetized {
  display: inline-block;
  position: absolute;
  padding: 5px 0;
  left: -30px;
  top: 12px;
  width: 115px;
  text-align: center;
  line-height: 16px;
  background: #ffc107;
  color: #fff;
  letter-spacing: 2px;
  -webkit-transform: rotate(318deg);
  transform: rotate(318deg);
  box-shadow: 0 2px 5px rgb(0 0 0 / 20%);
  border-radius: 0;
  z-index: 100;
}
.monetization-state .sc-monetized.has-access {
  background: #007bff;
}
.participant_block {
  font-size: 12px;
}
.participant_block div,
.participant_block button,
.participant_block a {
  border: 1px solid #ccc;
  padding: 5px;
  line-height: 1;
  border-radius: 0.25rem;
}
.participant_block div span,
.participant_block button span,
.participant_block a span {
  padding: 0;
  display: block;
  margin-bottom: 4px;
  font-size: 14px;
  font-weight: bold;
}
.participant_block div p,
.participant_block button p,
.participant_block a p {
  margin: 0;
  line-height: 1;
}
.like-counter {
  color: #ff3a5c;
}
.user-content-like {
  color: #ff3a5c;
  transition: all 0.125s !important;
}
.user-content-like:hover,
.user-content-like.user-liked {
  background-color: #ff3a5c;
  color: #fff;
  border-color: #ff3a5c;
}
.participant_block .action_parts:first-child p {
  font-size: 16px;
  line-height: 12px;
}
.space-members.user-admin .user_name::before {
  content: "\f505";
  color: #555;
  margin-left: 4px;
  font-family: "Font Awesome 5 Free";
  font-weight: 900;
  margin-right: 0.125rem;
}
.member-list-avatar {
  border: 1px solid #aaa;
  width: 86px;
  height: 86px;
}
#user_list dl {
  margin-bottom: 1rem;
}
#user_list dl dd {
  margin: 0;
  font-size: 13px;
  color: #555;
}
.space-user-content-wrapper .user_detail {
  line-height: 1;
}
.space-user-content-wrapper .user_detail p,
.space-user-content-wrapper .user_detail a {
  margin-bottom: 0;
  padding: 0;
}
.space-user-content-wrapper .user_detail p.user_name {
  line-height: 1.5;
}
.space-user-content-wrapper .user_detail p.ph img {
  width: 20px;
  height: 20px;
}
.space-user-content-wrapper .user_detail .user_name {
  font-size: 12px;
  margin-right: 2.4rem;
}
.user-content.trend-card {
  background: #fdf3d6;
}
.user-content.trend-card:nth-child(n + 1):nth-child(-n + 3):before {
  content: "";
  top: 0;
  right: 0;
  border-bottom: 4em solid transparent;
  border-right: 4em solid #ff8e15;
  position: absolute;
  z-index: 100;
}
.user-content.trend-card:nth-child(n + 1):nth-child(-n + 3):after {
  content: "Trend!";
  display: block;
  top: 12px;
  transform: rotate(45deg);
  color: #fff;
  right: 5px;
  position: absolute;
  z-index: 101;
  font-size: 13px;
}
.user-content.trend-card .participant_block div {
  border: #fff;
  background: rgba(255, 255, 255, 0.8);
}

/* user_comment_list */
.user_comment_list .comment_inner {
  background: #f5f5f5;
  border-radius: 0.5rem;
  padding: 1rem;
}
.user_comment_list .comment_inner .ph img {
  width: 46px;
  height: 46px;
  box-sizing: border-box;
  border: 3px solid #ddd;
}
.user_comment_list .comment_inner .time small,
.small.time {
  font-size: 11px;
  display: inline-block;
  margin-top: 3px;
}
.user_comment_list .comment_inner p.user_name {
  font-size: 13px;
}
.user_comment_list .comment_inner .contant_ttl {
  font-size: 12px;
  border-top: 1px solid #ccc;
  margin-top: 0.5rem;
  padding-top: 0.5rem;
}
.user_comment_list .comment_inner .comment_detail {
  font-size: 15px;
  line-height: 1.4rem;
  height: 2.8rem;
  text-overflow: ellipsis;
  overflow: hidden;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
}
span.alert {
  display: inline-block;
  background: #30b408;
  color: #fff;
  font-size: 11px;
  padding: 4px 6px;
  border-radius: 2px;
  line-height: 1;
}
.user_name_wrapper {
  position: relative;
  width: 100%;
}
.user_name_wrapper .alert {
  position: absolute;
  right: 0;
}
/* 上書き */
a,
button {
  color: #3a79aa;
  text-decoration: none;
}
a:hover,
button:hover {
  color: #ec6907;
  text-decoration: none !important;
}
#response-wrapper button.btn-link.btn-more,
.space-main-wrapper button.btn-link.btn-more,
.space-main-wrapper a.btn-link.btn-more {
  display: inline-block;
  width: 60%;
}
#response-wrapper button.btn-link.btn-more,
.space-main-wrapper button.btn-link.btn-more,
.space-main-wrapper button.btn-link.btn-more,
.space-main-wrapper a.btn-lin.btn-more,
.space-main-wrapper a.btn-link.btn-more {
  background: #efefef;
  color: #3a79aa;
  font-size: 14px;
  text-decoration: none;
}
#response-wrapper button.btn-link.btn-more:hover,
.space-main-wrapper button.btn-link.btn-more:hover,
.space-main-wrapper button.btn-link.btn-more:active,
.space-main-wrapper a.btn-link.btn-more:hover,
.space-main-wrapper a.btn-link.btn-more:active {
  background: #3a79aa !important;
  color: #fff !important;
  text-decoration: none;
}
.ar-list-wrapper div a:hover,
.ar-list-wrapper div a:focus,
.ar-list-wrapper div button:hover,
.ar-list-wrapper div button:focus {
  color: #fff !important;
  background: #3a79aa;
}
#settings-form h5 {
  font-weight: bold !important;
  border-top: 1px solid #bbb;
}
.float-right.btn-lg,
.float-left.btn-lg {
  width: 20% !important;
  max-width: 220px;
}
.space-main-wrapper .carousel-inner {
  background: #eee;
}
.org_detail {
  border-top: 1px solid #ccc;
  padding-top: 2rem;
}
.org_detail a {
  padding-top: 0.3125rem;
  padding-bottom: 0.3125rem;
  font-size: 1.25rem;
  line-height: inherit;
}
.org_detail a.contact {
  color: #21528e;
  font-size: 1rem;
  font-weight: normal;
  display: inline-block;
  width: 80%;
  max-width: 290px;
  background: #fff;
  padding: 0.55rem;
  border-radius: 0.25rem;
  border: 1px solid #999;
  line-height: 1;
}
.org_detail a.contact:hover,
.org_detail a.contact:active {
  background: #3a79aa;
  border: 1px solid #3a79aa;
  color: #fff !important;
}
.ar-list-wrapper {
  background: #efefef;
  padding: 5px 0;
}
.ar-list-wrapper ul {
  padding: 0;
  justify-content: flex-end;
}
.ar-list-wrapper li {
  margin: 0 3px 0 0;
  list-style: none;
  /*width:15%;*/
}
.ar-list-wrapper li a,
.ar-list-wrapper li button {
  display: block;
  padding: 8px 1rem;
  color: #fff !important;
  border-radius: 3px;
  line-height: 1;
}
li.link_ar a {
  background: #ff1f6a;
}
li.link_geoar a {
  background: #0b8bff;
}
li.link_detail a {
  background: #a469da;
}
/* album */
.space-album-gallery .album-group-header {
  padding-left: 0.25rem;
}
.space-album-gallery .album-group h3 {
  display: inline-block;
  padding: 0.6rem 1rem !important;
  border-radius: 30px;
  font-size: 0.9rem;
  background: #f0f0ee;
  line-height: 1.2;
  color: #333;
  border: none;
}
.space-album-gallery .album-group h3 button {
  line-height: 1;
  color: #ff8100;
}
.album-main-wrapper h1 {
  font-size: 1.7rem;
  font-weight: bold;
  margin-top: 6rem;
}
.warning_message {
  line-height: 1.8;
}
.h_wrapper.container {
  padding-left: 0;
  padding-right: 0;
}
.main-wrapper .mailform a.contact {
  color: #3a79aa;
  font-size: 1rem;
  font-weight: normal;
  display: inline-block;
}
a.fa-envelope-open:before {
  padding-right: 0.25rem;
}
.space-main-wrapper button.btn-join-space {
  background: #ff8800;
  color: #fff;
  min-width: 200px;
  font-size: 1.1rem;
}
.space-main-wrapper button.btn-join-space:hover {
  opacity: 0.7;
}
.space-main-wrapper h2.section-title {
  font-size: 1.7rem;
  margin-bottom: 2.5rem !important;
  text-align: center;
  margin-left: auto;
  margin-right: auto;
  /*padding-bottom: 10px;*/
  position: relative;
  color: #ff8100;
  padding: 0 45px;
  display: inline-block;
}
.space-main-wrapper h2.section-title:before {
  content: "";
  position: absolute;
  top: 50%;
  display: inline-block;
  width: 44px;
  height: 2px;
  background-color: #ff8100;
  -webkit-transform: rotate(-60deg);
  transform: rotate(-60deg);
  right: 0;
}
.space-main-wrapper h2.section-title:after {
  content: "";
  position: absolute;
  top: 50%;
  display: inline-block;
  width: 44px;
  height: 2px;
  background-color: #ff8100;
  -webkit-transform: rotate(60deg);
  transform: rotate(60deg);
  left: 0;
}

/* Contents */
.contents-grid {
  grid-template-columns: repeat(4, minmax(0, 1fr));
}

/* QMS */
.btn-view-terminal {
  background: #3a79aa;
  color: #fff !important;
}
.btn-view-terminal:hover {
  background: #115181;
}

/* iPad */
@media screen and (max-width: 1199px) {
  .space-cover-img {
    aspect-ratio: 3/1;
  }
  .space-content-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
  .space-content-grid.contents-grid {
    grid-template-columns: repeat(4, minmax(0, 1fr));
  }
}

/* スマホだけ */
@media screen and (max-width: 767px) {
  .space-content-grid {
    grid-template-columns: minmax(0, 1fr);
  }
  .space-content-grid.user-content-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
  .space-content-grid.contents-grid {
    grid-template-columns: minmax(0, 1fr);
  }
  .h1-wrapper h1 {
    font-size: 1.5rem;
    letter-spacing: -1px;
    line-height: 1.2;
  }
  .top-lead p {
    font-size: 0.9rem;
    font-weight: 200;
    line-height: 1.2;
  }
  form.form-wrapper .form-group {
    font-size: 1.1rem;
  }
  .space-item-wrapper h4,
  .space-user-content-wrapper h4 {
    font-size: 1rem;
  }
  .space-item-wrapper h4 {
    font-size: 1rem;
  }
  .container-fluid.main-wrapper .form-wrapper {
    margin-right: -15px;
    margin-left: -15px;
  }
  #settings-form label {
    font-size: 1.1rem;
  }
  form .form-control {
    margin-bottom: 0;
  }
  .btn_set .float-right.btn-lg,
  .btn_set .float-left.btn-lg {
    max-width: 220px;
    width: 49% !important;
    font-size: 1rem;
  }
  .page-title-wrapper {
    padding-left: 0;
    padding-right: 0;
  }
  #featured-items .carousel-item img {
    height: 100%;
    width: auto;
  }
  .org_detail a {
    font-size: 1.2rem;
  }
  .org_detail .thumb-img-sm {
    height: 35px;
    max-width: 50px;
    object-fit: cover;
  }
  .space-main-wrapper button.btn-link.btn-more,
  .space-main-wrapper a.btn-link.btn-more {
    width: 100%;
  }
  .ar-list-wrapper li a,
  .ar-list-wrapper li button {
    font-size: 14px;
    padding: 8px 0.25rem;
  }
  .space-cover-img {
    aspect-ratio: 16/9;
  }
  /* album */
  .album-main-wrapper h1 {
    font-size: 1.2rem;
    line-height: 1.5;
    margin-top: 0;
  }
  .space-album-gallery .album-group h3 {
    padding: 0.3rem 1rem;
    font-size: 0.9rem;
  }
  /*上書き*/
  .nav-link_wrapper a {
    font-size: 14px;
  }
  .space-main-wrapper .h_wrapper h2.section-title {
    font-size: 1.2rem !important;
    margin-bottom: 2rem !important;
    padding: 0 2.3rem;
  }
  .space-main-wrapper h2.section-title:before,
  .space-main-wrapper h2.section-title:after {
    width: 2.2rem;
  }
}
